Jednym z postawowych zastosowa± JavaScript jest interakcja z u┐ytkownikiem za pomoc▒ formularzy. Skrypty wykorzystywane s▒ tutaj, aby sprawdzaµ poprawno╢µ wprowadzonych danych, wy╢wietlaµ dynamicznie jakie╢ informacje, tworzyµ proste gry (bez u┐ycia dHTML'a).

Je┐eli chcesz nauczyµ siΩ korzystaµ z formularzy z poziomu JavaScript powiniene╢ znaµ hierarchΩ obiekt≤w wystΩpuj▒cych w tym jΩzyku:

Je┐eli mia│e╢ ju┐ styczno╢µ z jakim╢ jΩzykiem programowania, to wiesz zapewne, ┐e obiekty s▒ to takie struktury danych, kt≤re maj▒ swoje w│a╢ciwo╢ci oraz metody. Aby wykonaµ metodΩ przypisan▒ danemu obiektowi, ustawiµ lub odczytaµ w│a╢ciwo╢µ, poprzedzamy je obiektem, a oddzielamy kropk▒:

obiekt.w│asno╢µ;
obiekt.metoda();

Wiecej dowiecie siΩ z lekcji 27.

Taki obiekt mo┐e byµ pojemnikiem dla innych obiekt≤w, to znaczy, ┐e jest w stosunku do nich nadrzΩdny i jedynie za pomoc▒ tego w│a╢nie obiektu mo┐na do nich dotrzeµ. Przyk│adowo obiekt Form jest obiektem nale┐▒cym do document. Grupy obiekt≤w, kt≤re nie posiadaj▒ w│asnych w│a╢ciwo╢ci ani metod s▒ czΩsto nazywane kolekcjami.

Chc▒c skorzystaµ z w│a╢ciwo╢ci value obiektu Text (pod t▒ zmienn▒ przechowywany jest tekst wy╢wietlany w obiekcie Input typu Text) piszemy:

document.nazwa_formy.nazwa_text.value = "Cze╢µ";

W miejsce nazwa_formy wstawiamy nazwΩ zadeklarowan▒ w znaczniku Form pod parametrem NAME. Analogicznie postΩpujemy z nazwa_text, np:

<SCRIPT LANGUAGE="JavaScript">
<!--
 function zwieksz()
  {
   document.rachunek.procent.value++;
   document.rachunek.procent.focus();
  }

 function zmniejsz()
  {
   document.rachunek.procent.value--;
   document.rachunek.procent.focus();
  } 

//-->
</SCRIPT>

.. i w sekcji BODY:

<FORM NAME="rachunek">
 <INPUT TYPE="text" NAME="procent" Value="7" SIZE="1"> %
 <INPUT TYPE="button" Value="+" onClick="zwieksz()">
 <INPUT TYPE="button" Value="-" onClick="zmniejsz()">
</FORM>

.. i w efekcie mamy:

Zaprezentowana tu metoda odwo│ywania siΩ do p≤l formularza nie jest jedyn▒ dostΩpn▒. Korzystaj▒c z naszego przyk│adu poka┐Ω jak mo┐na napisaµ to w inny spos≤b:

document.forms["rachunek"].procent.value;
document.rachunek.elements["procent"].value;
document.forms["rachunek"].elements["procent"].value;

Metoda korzystaj▒ca z tablic element≤w czasami jest wygodniejsza, poniewa┐ nie musimy siΩ odwo│ywaµ za pomoc▒ nazw danych p≤l, a jedynie podaµ index elementu, np.:

document.forms[1].elements[0]

W ten spos≤b mamy dostΩp do pierwszego elementu drugiego formularza.

Praktycznie t▒ drog▒ mo┐emy odwo│ywaµ siΩ do ka┐dego elementu formularza poza Select. Odwo│anie w tym wypadku wygl▒da nastΩpuj▒co:

document.rachunek.waluta.options[index]

W│a╢ciwo╢ci i metody wszystkich predefiniowanych obiekt≤w dostΩpne s▒ w dodatkach.